<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix text-left">
        <span class="title-icon">查货</span>
      </div>
      <el-row class="padding">
        <el-col :span="2">
          <span>箱号:</span>
        </el-col>
        <el-col :span="6">
          <el-input size="mini" v-model.trim="boxNo" placeholder="请录入"></el-input>
        </el-col>
        <el-col :span="4" style="margin-left: 10px;">
          <el-button
            size="mini"
            type="primary"
            @click="queryAndprintWaybillLabel"
            >打印运单标签</el-button
          >
        </el-col>
      </el-row>
    </el-card>
    <el-card class="padding margin-top info-box">
      <el-row>
        <el-col :span="4">
          <span>运单号:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ waybillNo }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>客户:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>库区:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ reservoirArea }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>入库渠道:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ inStockName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>出库渠道:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ outStockName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>总件数:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ count }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>报关方式:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerWay }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>订单状态:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ statusName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>销售:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ saleName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>耗时（毫秒）:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ time }}</span>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>
<script>
import { ajax } from "@/store/yg/common/utils";
import axios from "axios";
import * as constant from "@/store/yg/common/constant";
import { m } from "@/store/yg/common/local";
import { getLodop } from "@/store/yg/common/LodopFuncs";
export default {
  components: {},
  props: [],
  data() {
    return {
      boxNo: "",
      waybillNo: "",
      customerName: "",
      inStockName: "",
      outStockName: "",
      count: "",
      customerWay: "",
      statusName: "",
      saleName: "",
      time: "",
      reservoirArea: "",
      waybillId: []
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    queryAndprintWaybillLabel() {
      if (!this.boxNo) {
        this.$message.error("请输入箱号");
        return;
      }
      if (this.boxNo.length<6) {
        this.$message.error("请输入正确的箱号");
        return;
      }
      ajax("doCargoTrace", { boxNo: this.boxNo, isPrint: true }).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            var data = res.data;
            this.waybillNo = data.waybillNo;
            this.customerName = data.customerName;
            this.inStockName = data.inStockName;
            this.outStockName = m(data.outStockName);
            this.count = data.count;
            this.customerWay = data.customerWay;
            this.statusName = m(data.statusName);
            this.saleName = data.saleName;
            this.time = data.time;
            this.waybillId = data.waybillId;
            this.reservoirArea=data.reservoirArea;
            this.printWaybillLabel10();
          } else {
            if (res.message){
              this.$message.error(res.message);
            }else{
              this.$message.error("操作失败");
            }
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    printWaybillLabel10() {
      this._printWaybillLabel10(this.waybillId, "WL", "", "");
    },
    _printWaybillLabel10(waybillId, surfaceSingleCode, boxNo, printName) {
      ajax("printWaybillLabel", {
        ids: waybillId,
        surfaceSingleCode: surfaceSingleCode
      }).then(
        res => {
          if (res.code != 200) {
            this.$message.error(res.message);
          } else {
            const htmls = res.data;
            console.info("打印HTML面单A4");
            this._printWaybillLabelA4(htmls, printName);
          }
        },
        error => {
          console.log(error);
        }
      );
    },

    // LODOP 插件打印 A4
    _printWaybillLabelA4(htmls, printName) {
      if (null == htmls || typeof htmls === "undefined") {
        return;
      }
      let LODOP = getLodop();
      LODOP.PRINT_INIT("打印订单信息");
      LODOP.SET_PRINT_PAGESIZE(1, 0, 0, "A4");
      var pageNum = Math.ceil(htmls.length / 6);
      var htmlLength = htmls.length;
      for (var j = 0; j < pageNum; j++) {
        var n = 6 * j;
        for (var m = 0; m < 6; m++) {
          var k = m + n;
          if (k >= htmlLength) {
            continue;
          }
          var html = htmls[k];
          if (m == 0) {
            LODOP.ADD_PRINT_HTM(0, 0, "94mm", "94mm", html); // Top,Left,Width,Height,strHtmlContent
          } else if (m == 1) {
            LODOP.ADD_PRINT_HTM(0, "100mm", "94mm", "94mm", html);
          } else if (m == 2) {
            LODOP.ADD_PRINT_HTM("97mm", 0, "94mm", "94mm", html);
          } else if (m == 3) {
            LODOP.ADD_PRINT_HTM("97mm", "100mm", "94mm", "94mm", html);
          } else if (m == 4) {
            LODOP.ADD_PRINT_HTM("194mm", 0, "94mm", "94mm", html);
          } else if (m == 5) {
            LODOP.ADD_PRINT_HTM("194mm", "100mm", "94mm", "94mm", html);
          }
          // $("body").append(
          //   "<div id='templateContentHtml' style='display:none'>" +
          //     html +
          //     "</div>"
          // );
          const d = document.createElement("div");
          d.id = "templateContentHtml";
          d.innerHTML = html;
          d.style.display = "none";
          document.body.appendChild(d);
          var barCodes = document.getElementsByName("barcode");
          for (var i = 0; i < barCodes.length; i++) {
            var barCode = barCodes[i];
            var value = barCode.getAttribute("value");
            var values;
            if (value.indexOf("|") >= 0) {
              values = barCode.getAttribute("value").split("|");
            } else {
              values = barCode.getAttribute("value").split("-");
            }
            var reg = new RegExp("mm", "g");
            if (values[5] != "" && values[5] != null) {
              var codes = values[5].split("+");
              var serialNo = codes[0].substring(6, codes[0].length);
              var top = values[0].replace(reg, "").trim();
              var left = values[1].replace(reg, "").trim();
              left = parseFloat(left);
              top = parseFloat(top);
              if (m == 0) {
                if (i == 1) {
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    295,
                    left - 5 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 16);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(290, left + 9 + "mm", 100, 10, serialNo);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    295,
                    left + 29 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                left = left - 5 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  values[0],
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              } else if (m == 1) {
                if (i == 1) {
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    295,
                    left + 95 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 16);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    290,
                    left + 109 + "mm",
                    100,
                    10,
                    serialNo
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    295,
                    left + 129 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                left = left + 95 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  values[0],
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              } else if (m == 2) {
                if (i == 1) {
                  var codes = values[5].split("+");
                  var serialNo = codes[0].substring(6, codes[0].length);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    661,
                    left - 5 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 16);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(656, left + 9 + "mm", 100, 10, serialNo);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    661,
                    left + 29 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                top = top + 97 + "mm";
                left = left - 5 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  top,
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              } else if (m == 3) {
                if (i == 1) {
                  var codes = values[5].split("+");
                  var serialNo = codes[0].substring(6, codes[0].length);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    661,
                    left + 95 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 16);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    656,
                    left + 109 + "mm",
                    100,
                    10,
                    serialNo
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    661,
                    left + 129 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                left = left + 95 + "mm";
                top = top + 97 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  top,
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              } else if (m == 4) {
                if (i == 1) {
                  var codes = values[5].split("+");
                  var serialNo = codes[0].substring(6, codes[0].length);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1028,
                    left - 5 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 14);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1024,
                    left + 9 + "mm",
                    100,
                    10,
                    serialNo
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1028,
                    left + 28 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                top = top + 194 + "mm";
                left = left - 5 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  top,
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              } else if (m == 5) {
                if (i == 1) {
                  var codes = values[5].split("+");
                  var serialNo = codes[0].substring(6, codes[0].length);
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1028,
                    left + 95 + "mm",
                    60,
                    10,
                    codes[0].substring(0, 6)
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 14);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1024,
                    left + 109 + "mm",
                    100,
                    10,
                    serialNo
                  );
                  LODOP.SET_PRINT_STYLE("FontSize", 10);
                  LODOP.SET_PRINT_STYLE("Bold", 1);
                  LODOP.ADD_PRINT_TEXT(
                    1028,
                    left + 128 + "mm",
                    40,
                    10,
                    "+" + codes[1]
                  );
                }
                left = left + 95 + "mm";
                top = top + 194 + "mm";
                LODOP.ADD_PRINT_BARCODE(
                  top,
                  left,
                  values[2],
                  values[3],
                  values[4],
                  values[5]
                );
              }
            }
            if (
              values[6] == 1 ||
              typeof values[6] == "undefined" ||
              values[6] == ""
            ) {
              if (i == 1) {
                LODOP.SET_PRINT_STYLEA(0, "ShowBarText", 0);
              } else {
                LODOP.SET_PRINT_STYLEA(0, "ShowBarText", 1);
              }
              LODOP.SET_PRINT_STYLEA(0, "AlignJustify", 2);
            } else {
              LODOP.SET_PRINT_STYLEA(0, "ShowBarText", 0);
            }
          }
          document.body.removeChild(d);
        }
        LODOP.NewPage(); //分页
      }
      if (this.isNotNull(printName)) {
        LODOP.SET_PRINTER_INDEX(printName);
      } else {
        LODOP.PREVIEW();
      }
    },
    isNotNull(objStr) {
      if (
        objStr == "" ||
        objStr == null ||
        objStr == "null" ||
        objStr == "undefined" ||
        typeof objStr == "undefined"
      ) {
        return false;
      }
      if (objStr == undefined || typeof objStr == undefined) {
        return false;
      }
      if (typeof objStr == "object" && objStr.length < 1) {
        return false;
      }
      return true;
    },
    // LODOP 插件打印HTML
    _print10(htmls, printName) {
      if (null == htmls || typeof htmls === "undefined") {
        return;
      }
      console.log("标签打印中" + printName + ",htmls.size=" + htmls.length);
      let LODOP = getLodop();
      LODOP.PRINT_INIT("打印订单信息");
      LODOP.SET_PRINT_PAGESIZE(1, "100mm", "100mm", "CreateCustomPage");
      for (var j = 0; j < htmls.length; j++) {
        var html = htmls[j];
        LODOP.ADD_PRINT_HTM(0, 0, "100mm", "98mm", html);
        // $("body").append(
        //   "<div id='templateContentHtml' style='display:none'>" +
        //     html +
        //     "</div>"
        // );
        const d = document.createElement("div");
        d.id = "templateContentHtml";
        d.innerHTML = html;
        d.style.display = "none";
        document.body.appendChild(d);
        var barCodes = document.getElementsByName("barcode");
        for (var i = 0; i < barCodes.length; i++) {
          var barCode = barCodes[i];
          var value = barCode.getAttribute("value");
          var values;
          if (value.indexOf("|") >= 0) {
            values = barCode.getAttribute("value").split("|");
          } else {
            values = barCode.getAttribute("value").split("-");
          }
          LODOP.ADD_PRINT_BARCODE(
            values[0],
            values[1],
            values[2],
            values[3],
            values[4],
            values[5]
          );
          LODOP.SET_PRINT_STYLEA(0, "ShowBarText", 1);
          if (values[6] == 1 || typeof values[6] == "undefined") {
            LODOP.SET_PRINT_STYLEA(0, "AlignJustify", 2);
          } else {
            LODOP.SET_PRINT_STYLEA(0, "ShowBarText", 0);
          }
        }
        document.body.removeChild(d);
        LODOP.NewPage(); //分页
      }
      if (this.isNotNull(printName)) {
        LODOP.SET_PRINTER_INDEX(printName);
        LODOP.PRINT();
      } else {
        LODOP.PREVIEW();
      }
    }
  }
};
</script>
<style></style>
<style scoped>
.info-box >>> .el-row {
  margin-bottom: 10px;
}
</style>
